<template>
<!-- pages/address/address.wxml -->
<view class="address">
    <view class="address_form">
        <view class="form_item">
            <text class="form_lab">联系人</text>
            <input class="form_input" v-model="nickname" type="text" placeholder="收件人" placeholder-style="color: #999999;">
            <image class="form_icon icon_phone" src="/static/pages/image/phone.png"></image>
        </view>
        <view class="form_item">
            <text class="form_lab">联系电话</text>
            <input class="form_input" v-model="phone" type="text" placeholder="联系电话" placeholder-style="color: #999999;">
        </view>
        <view class="form_item">
            <text class="form_lab">选择地区</text>
            <input class="form_input" v-model="area" type="text" placeholder="省、市、区、乡镇/街道" placeholder-style="color: #999999;">
            <image class="form_icon icon_location"  @tap="authorize" src="/static/pages/image/location_black.png"></image>
        </view>
        <view class="form_item">
            <text class="form_lab">详细地址</text>
            <input class="form_input" v-model="address" type="text" placeholder="街道门牌信息" placeholder-style="color: #999999;">
        </view>
    </view>

    <view class="defaultAddress" @tap="onChangeActive">
        <text class="defaultAddress_txt">设为默认地址</text>
        <image v-if="is_default == 1" class="defaultAddress_img" src="/static/pages/image/chcked.png"></image>
        <view v-else class="defaultAddress_round"></view>
    </view>

    <view class="footer">
        <button class="footer_buttom" @tap="onSave">保存并使用</button>
    </view>
</view>
</template>

<script>
// pages/address/address.js
var app = getApp();

export default {
  data() {
    return {
      id: null,
      nickname: null,
      phone: null,
      area: null,
      address: null,
      is_default: 0
    };
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    if (options.id) {
      this.setData({
        id: options.id
      });
      this.getDetails();
    }
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {},
  methods: {
    //选择地理位置
    authorize() {
      let that = this;
      wx.authorize({
        scope: 'scope.userLocation',

        success(res) {
          that.choosePoi();
        },

        fail(error) {
          if (error.errMsg == 'authorize:fail auth deny') {
            wx.showToast({
              title: '获取权限失败',
              duration: 2000,
              icon: 'none'
            });
          }

          if (error.errMsg.indexOf('12006') != -1) {
            that.openSetting();
          }
        }

      });
    },

    openSetting() {
      let that = this;
      wx.openSetting({
        success(res) {
          if (res.authSetting['scope.userLocation']) {
            that.choosePoi();
          }
        }

      });
    },

    choosePoi() {
      wx.chooseLocation({
        success: res => {
          this.setData({
            area: res.address
          });
        },
        fail: err => {
          console.log(err);
        }
      });
    },

    // 设置默认地址
    onChangeActive() {
      let is_default = this.is_default == 1 ? 0 : 1;
      this.setData({
        is_default: is_default
      });
    },

    onSave() {
      // 有id就编辑
      if (this.id) return this.changeAddress();
      if (!this.nickname) return this.showToast('请输入收件人');
      if (!this.phone) return this.showToast('请输入手机号');
      if (!this.area) return this.showToast('请选择地址');
      if (!this.address) return this.showToast('请输入详细地址');
      wx.showLoading({
        title: '加载中'
      });
      app.globalData.util.request({
        url: "entry/wxapp/Api",
        data: {
          m: "monai_market",
          r: "member.index.receipt_add",
          uid: wx.getStorageSync('uid'),
          nickname: this.nickname,
          phone: this.phone,
          area: this.area,
          address: this.address,
          is_default: this.is_default
        },
        success: res => {
          this.showToast('添加成功');
          setTimeout(() => {
            wx.navigateBack();
          }, 1000);
          wx.hideLoading();
        },
        fail: res => {
          wx.hideLoading();
        }
      });
    },

    changeAddress() {
      wx.showLoading({
        title: '加载中'
      });
      app.globalData.util.request({
        url: "entry/wxapp/Api",
        data: {
          m: "monai_market",
          r: "member.index.receipt_up",
          uid: wx.getStorageSync('uid'),
          id: this.id,
          nickname: this.nickname,
          phone: this.phone,
          area: this.area,
          address: this.address,
          is_default: this.is_default
        },
        success: res => {
          this.showToast('修改成功');
          setTimeout(() => {
            wx.navigateBack();
          }, 1000);
          wx.hideLoading();
        },
        fail: res => {
          wx.hideLoading();
        }
      });
    },

    getDetails(id) {
      wx.showLoading({
        title: '加载中'
      });
      app.globalData.util.request({
        url: "entry/wxapp/Api",
        data: {
          m: "monai_market",
          r: "member.index.receipt_detail",
          uid: wx.getStorageSync('uid'),
          id: this.id
        },
        success: res => {
          let data = res.data.data;
          this.setData({
            nickname: data.nickname,
            phone: data.phone,
            area: data.area,
            address: data.address,
            is_default: data.is_default
          });
          wx.hideLoading();
        },
        fail: res => {
          wx.hideLoading();
        }
      });
    },

    showToast(title) {
      wx.showToast({
        title: title,
        duration: 2000,
        icon: 'none'
      });
    }

  }
};
</script>
<style>
@import "./address.css";
</style>